﻿@{ ViewBag.Title = "Add";
    Layout = "~/Areas/Shared/_LayuiForm.cshtml"; }
<style type="text/css">
    .fr {
        float: right;
    }
</style>
<form class="layui-form ">
    <div class="layui-form-item">
        <label class="layui-form-label required">用户名</label>
        <div class="layui-input-block">
            <input type="text" name="Account" placeholder="用户名" autocomplete="off" class="layui-input" lay-verify="required|id" maxlength="15">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label required">真实姓名</label>
        <div class="layui-input-block">
            <input type="text" name="RealName" placeholder="姓名" autocomplete="off" class="layui-input" lay-verify="required" maxlength="30">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label required">用户部门</label>
        <div class="layui-input-block">
            <input type="text" id="DeptNo" lay-filter="tree" name="DeptNo" placeholder="==请选择部门==" autocomplete="off" class="layui-input" readonly="readonly" lay-verify="required">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label required">用户角色</label>
        <div class="layui-input-block">
            @Html.DropDownList("RoleId", (IEnumerable<SelectListItem>)ViewBag.RoleList, "==请选择角色==", new Dictionary<string, object> { { "lay-verify", "required" } })
        </div>
    </div>
    @Html.GenderRadioHtml()
    <div class="layui-form-item">
        <label class="layui-form-label">手机号码</label>
        <div class="layui-input-block">
            <input type="text" name="MobilePhone" placeholder="手机号码" autocomplete="off" class="layui-input" maxlength="11">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">微信</label>
        <div class="layui-input-block">
            <input type="text" name="WeChat" placeholder="微信" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">邮箱</label>
        <div class="layui-input-block">
            <input type="text" name="Email" placeholder="邮箱" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">出生日期</label>
        <div class="layui-input-block">
            <input type="text" name="Birthday" id="birthday" placeholder="请选择出生日期" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="add">添加</button>
        </div>
    </div>
</form>
<script>
    layui.use(["form", "laydate", "exLayer", "exUtils", "upload", "layer", "treeSelect"], function () {
        let form = layui.form;
        let laydate = layui.laydate;
        let exLayer = layui.exLayer;
        let exUtils = layui.exUtils;
        let upload = layui.upload;
        let layer = layui.layer;
        let treeSelect = layui.treeSelect;
        let $ = layui.$;

        laydate.render({ elem: "#birthday" });

        form.verify({
            id: function (value, item) {
                if (!new RegExp("^[a-zA-Z]+[a-zA-Z0-9]+$").test(value)) {
                    return '编码由英文字符和数字组成，并以字母开头，不得包含中文、空格及其他字符';
                }
            }
        });

        treeSelect.render({
            elem: "#DeptNo",
            data: "/SysBasic/Organize/GetOrganizeTreeSelect",
            type: "GET"
        });

        form.on("submit(add)", function (data) {
            exUtils.ajax("/SysBasic/User/Add", "post", data.field, true).done(function (response) {
                exLayer.greenTickMsg(response.message, function () {
                    parent.layui.table.reload('tableId', { url: "/SysBasic/User/GetPageListBySearch" });
                    parent.layer.close(parent.layer.getFrameIndex(window.name));
                });
            }).fail(function (error) {
                console.log(error);
            });
            return false;
        });
    });
</script>